<template>
  <div id="ShowTable">
    <el-table
      :data="tableData"
      stripe
      style="width: 100%"
      @selection-change="selectFun"
      :id="tableId"
    >

    <slot name='select'></slot>
      <!-- <el-table-column type="selection" width="80"> </el-table-column> -->
      <el-table-column prop="id" label="ID" width="180"> </el-table-column>
      <el-table-column prop="username" label="用户名" width="180">
      </el-table-column>
      <el-table-column prop="userType" label="类型" width="180">
      </el-table-column>
      <el-table-column prop="realName" label="真实姓名" width="180">
      </el-table-column>
      <el-table-column prop="phone" label="电话" width="180"> </el-table-column>
      <el-table-column prop="school" label="学校" width="180">
      </el-table-column>
      <el-table-column prop="department" label="院系" width="180">
      </el-table-column>
      <el-table-column prop="grade" label="年级" width="180"> </el-table-column>
      <el-table-column prop="major" label="专业" width="180"> </el-table-column>
      <el-table-column prop="className" label="班级" width="180">
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  name: "ShowTable",
  components: {},
  props: {
    tableList: Array, //父组件传递表格数据
    tableId:String,
  },
  data() {
    return {
      selectList:[]
    };
  },
  methods: {
    selectFun(e) {
      this.$emit('childGetSelect',e);
    },
  },
  computed: {
    //处理表格数据
    tableData: function() {
      [...this.tableList].forEach((item) => {
        item.userType = item.userType == 1 ? "学生" : "教师";
      });

      return this.tableList;
    },
  },
};
</script>

<style></style>
